<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link href="/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="/css/animate.css" rel="stylesheet">
    <link href="/css/style.css?v=4.1.0" rel="stylesheet">

    <link href="/bootstraptable/bootstrap-table.min.css" rel="stylesheet">
</head>
<body>

<div class="container" id="gong1">
    <div style="text-align: right">
        <button class="btn btn-default" id="yulan">预览</button>
        <button type="button" class="btn btn-default"><a href="javascript:history.back(-1)"
                                                         style="color: black">返回</a></button>

    </div>
    <!--查询条件面板-->
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 align="center">工序物料设计单</h3>
        </div>
        <div class="panel-body">
            <div>制造:<span id="productName10"></span>,供选择的物料清单如下:</div>
            <!--物料明细表格-->
            <table class="table table-bordered table-striped" data-toggle="table" id="module_details_table">
                <thead>
                <tr>
                    <th data-field="id">序号</th>
                    <th data-field="productName">物料名称</th>
                    <th data-field="productId">物料编号</th>
                    <th data-field="productDescribe">描述</th>
                    <th data-field="amount">设计数量</th>
                    <th data-field="residualAmount">可用数量</th>
                    <th data-field="amountUnit">单位</th>
                    <th data-field="costPrice">单价(元)</th>
                    <th data-field="amount" data-formatter="formateerText">本工序数量</th>
                </tr>
                </thead>
            </table>
        </div>
    </div>

</div>
<div class="container" id="gong2">
    <div style="text-align: right">
        <button class="btn btn-default" id="tijiao">提交</button>
        <button type="button" class="btn btn-default"><a href="javascript:history.back(-1)"
                                                         style="color: black">返回</a></button>

    </div>
    <!--查询条件面板-->
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 align="center">工序物料设计单</h3>
        </div>
        <div class="panel-body">
            <div class="panel-body">
                <div class="form-group">
                    <div class="col-sm-6">
                        <label class="col-sm-4 control-label">工序单编号</label>
                        <div class="col-sm-8">
                            <input type="text" name="designId" id="designId"
                                   class="form-control text_no_border ">
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <label class="col-sm-4 control-label">工序名称</label>
                        <div class="col-sm-8">
                            <input type="text" name="procedureName" id="procedureName"
                                   class="form-control text_no_border">
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-6">
                        <label class="col-sm-4 control-label">登记人</label>
                        <div class="col-sm-8">
                            <input type="text" name="register" id="register"
                                   class="form-control text_bottom_border"
                                   value="">
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <label class="col-sm-4 control-label">登记时间</label>
                        <div class="col-sm-8">
                            <input type="text" name="registerTime" id="registerTime"
                                   class="form-control text_bottom_border"
                                   value="">
                        </div>
                    </div>
                </div>

                <!--物料明细表格-->
                <table class="table table-bordered table-striped" data-toggle="table" id="module_details_table2">
                    <thead>
                    <tr>
                        <th data-field="id">序号</th>
                        <th data-field="productName">物料名称</th>
                        <th data-field="productId">物料编号</th>
                        <th data-field="productDescribe">描述</th>
                        <th data-field="amount">本工序数量</th>
                        <th data-field="amountUnit">单位</th>
                        <th data-field="costPrice">单价(元)</th>
                        <th data-field="subtotal">小计</th>
                    </tr>
                    </thead>
                </table>
            </div>
        </div>
    </div>
</div>
<input type="hidden" id="hhh">
<!-- 全局js -->
<script src="/js/jquery.min.js?v=2.1.4"></script>
<script src="/js/bootstrap.min.js?v=3.3.6"></script>
<script src="/js/plugins/metisMenu/jquery.metisMenu.js"></script>
<script src="/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<script src="/js/plugins/layer/layer.min.js"></script>

<!-- 自定义js -->
<script src="/js/hAdmin.js?v=4.1.0"></script>
<!--<script type="text/javascript" src="/js/index.js"></script>-->

<!-- 第三方插件 -->
<script src="/js/plugins/pace/pace.min.js"></script>

<!--BootstrapTable-->
<script src="/bootstraptable/bootstrap-table.min.js"></script>
<script src="/bootstraptable/locale/bootstrap-table-zh-CN.min.js"></script>
<script>
    $(function () {
        $("#gong2").hide()
        //产品编号
        let id = localStorage.getItem("id12")
        let id1 = localStorage.getItem("id13")
        let pa = localStorage.getItem("pa")
        $("#registerTime").val(fortime)
        $.post("/Procedure/getOne", {"pa": pa}, function (res) {
            $("#procedureName").val(res.procedureName)
        })
        $.post("/ManufactureDesignProcedure/getOne", {"id": id1}, function (res) {
            $("#productName10").html(res.productName)
            $("#designId").val(res.designId)
            $("#register").val(res.register)
        })

        $.post("/design/module/moduleId", {"id": id}, function (res) {

            $.post("/design/module/showDetails1", {"id": res.id}, function (res) {
                console.log(res);
                for (let i = 0; i < res.length; i++) {
                    // 向物料明细表格中添加一行

                    $("#module_details_table").bootstrapTable('append', res[i])
                }
            })
        })

    })
    function formateerText(value, row, index) {
        return `<input type="text" name="amount" onblur="changeAmount(this)" onchange="changetext(this)" >`
    }

    // function changetext(para) {
    //     let para1 = $(para).val()
    //     let para2 = $(para).parent().parent().find(":eq(5)").html()
    //     if (para1 > para2) {
    //         alert("本次工序数量不能大于可用数量")
    //         return
    //
    //     }
    // }

    function changeAmount(param) {

        // 文本框的数量
        let val = $(param).val()
        // 获取文本框所在的行索引
        let index = $(param).parent("td").parent().index()

        // 获取物料明细表格的所有数据
        let data = $("#module_details_table").bootstrapTable("getData")

        // 修改对应对象的amount
        data[index].amount = parseInt(val)

        // if ( data[index].amount>data[index].residualAmount){
        //     alert("本次工序数量不能大于可用数量")
        //     return
        // }

    }
    $("#yulan").click(function () {
        if($("#hhh").val()=="本次工序数量不能大于可用数量"){
            let data = $("#module_details_table2").bootstrapTable("getData")
             for (let i = 0; i < data.length; i++) {
                data.splice(i,1)
                 data.splice(i,1)
            }
            }
        // 获取物料明细表格的所有数据
        let data = $("#module_details_table").bootstrapTable("getData")

        console.log("data", data)

        let flag = -1
        for (let i = 0; i < data.length; i++) {

            if (data[i].residualAmount < data[i].amount) {
                flag = i

                $("#hhh").val("本次工序数量不能大于可用数量")
                alert("本次工序数量不能大于可用数量")

                return
            }
            // 计算明细小计
            data[i].subtotal = data[i].costPrice * data[i].amount
            $("#module_details_table2").bootstrapTable('append', data[i])
        }

        if (flag == -1) {
            $("#gong1").hide()
            $("#gong2").show()
        }
    })
    $("#tijiao").click(function () {
        let data = $("#module_details_table2").bootstrapTable("getData")
        let dto={
            //产品编号
            "productId": localStorage.getItem("id12"),
            //工序编号
            "procedureId":localStorage.getItem("pa")
        }

        dto.details=data
        //发送请求
        $.ajax({
            url:"/ManufactureDesignProcedure/addProcedureModule",
            type: "post",
            data: JSON.stringify(dto),
            contentType: "application/json",
            success: function (data) {

                location.href="/produce/module_design_procedure_formulateUI"
               // location.href="/design/succeed"
            }
        })
    })

    function fortime() {
        let date = new Date();
        let y = date.getFullYear();
        let m = date.getMonth() + 1;
        let d = date.getDate();
        let h = date.getHours();
        let mm = date.getMinutes();
        let s = date.getSeconds();
        return (y + '-' + add(m) + '-' + add(d) + ' ' + add(h) + ':' + add(mm) + ':' + add(s));
    }

    function add(m) {
        return m < 10 ? '0' + m : m
    }

</script>
</body>
</html>